// only work with wide screen

@media mq-normal {
  body.monochrome .main-container {
    .article,
    .sidebar img {
      -webkit-filter: grayscale(60%);
      -moz-filter: grayscale(60%);
      -ms-filter: grayscale(60%);
      -o-filter: grayscale(60%);
      filter: grayscale(60%);
      transition-duration: 0.4s;
      transition-property: filter, -webkit-filter, -moz-filter, -ms-filter, -o-filter;

      &:hover {
        -webkit-filter: grayscale(0%);
        -moz-filter: grayscale(0%);
        -ms-filter: grayscale(0%);
        -o-filter: grayscale(0%);
        filter: grayscale(0%);
      }
    }
  }
}
